'use client'

import type React from 'react'
// import { HoverHighlightProps, HoverHighlights } from '@blocks/HoverHighlights'

// import { StyleguidePageContent } from '../../PageContent/index'

// const data: HoverHighlightProps = {
//   hoverHighlightsFields: {
//     richText: [
//       {
//         children: [
//           {
//             text: "Boom—you've got a CMS.",
//           },
//         ],
//         type: 'h2',
//       },
//       {
//         children: [
//           {
//             text: 'Everything is dynamic and based on your config. No code generation, so no breaking changes when we update. Extend anything.',
//           },
//         ],
//       },
//     ],
//     addRowNumbers: true,
//     highlights: [
//       {
//         title: 'Database',
//         description: 'Perfectly clean, reusable data that scales with you.',
//         media: {
//           id: '635a86bd45c951f3f9132c03',
//           alt: 'Dark textured card that reads: Launch week (and building our site in public)',
//           filename: 'launch-week.webp',
//           mimeType: 'image/webp',
//           filesize: 31768,
//           width: 1920,
//           height: 1079,
//           createdAt: '2022-10-27T13:25:17.760Z',
//           updatedAt: '2022-10-27T13:25:17.760Z',
//           url: '/media/launch-week.webp',
//         },
//         link: {
//           type: 'reference',
//           reference: null,
//           url: '',
//         },
//         id: '63669289c67b541ae1680295',
//       },
//       {
//         title: 'API',
//         description:
//           'Powerful and reusable REST, GraphQL and Local Node APIs to power the backend of any project.',
//         media: {
//           id: '635a86bd45c951f3f9132c03',
//           alt: 'Dark textured card that reads: Launch week (and building our site in public)',
//           filename: 'launch-week.webp',
//           mimeType: 'image/webp',
//           filesize: 31768,
//           width: 1920,
//           height: 1079,
//           createdAt: '2022-10-27T13:25:17.760Z',
//           updatedAt: '2022-10-27T13:25:17.760Z',
//           url: '/media/launch-week.webp',
//         },
//         link: {
//           type: 'reference',
//           reference: null,
//           url: '',
//         },
//         id: '6366929ac67b541ae1680296',
//       },
//       {
//         title: 'Admin UI',
//         description:
//           'A CMS-grade editor generated for you, but still completely extensible in React.',
//         media: {
//           id: '635a86bd45c951f3f9132c03',
//           alt: 'Dark textured card that reads: Launch week (and building our site in public)',
//           filename: 'launch-week.webp',
//           mimeType: 'image/webp',
//           filesize: 31768,
//           width: 1920,
//           height: 1079,
//           createdAt: '2022-10-27T13:25:17.760Z',
//           updatedAt: '2022-10-27T13:25:17.760Z',
//           url: '/media/launch-week.webp',
//         },
//         link: {
//           type: 'reference',
//           reference: null,
//           url: '',
//         },
//         id: '636692a7c67b541ae1680297',
//       },
//     ],
//   },
//   id: '63669272c67b541ae1680294',
//   blockName: 'Database, API, Admin UI',
//   blockType: 'hoverHighlights',
// }

// const dataWithoutNumbers = {
//   ...data,
//   hoverHighlightsFields: {
//     ...data.hoverHighlightsFields,
//     addRowNumbers: false,
//   },
// }

export const HoverHighlightsPage: React.FC = () => {
  // Disabled until frontend work is done
  return null
  // return (
  //   <StyleguidePageContent title="Card Grid">
  //     <HoverHighlights {...data} />
  //     <HoverHighlights {...dataWithoutNumbers} />
  //   </StyleguidePageContent>
  // )
}
